<template>
  <div class="home">
    <main>
      <!-- 二级路由 -->
      <router-view />
    </main>
    <footer>
      <van-tabbar route>
        <van-tabbar-item replace to="/Home/Index" icon="wap-home">首页</van-tabbar-item>
        <van-tabbar-item replace to="/Home/Classify" icon="add">分类</van-tabbar-item>
        <van-tabbar-item replace to="/Home/Shop" icon="cart">购物车</van-tabbar-item>
        <van-tabbar-item replace to="/Home/Me" icon="friends">我的</van-tabbar-item>
      </van-tabbar>
    </footer>
  </div>
</template>

<script>
// @ is an alias to /src
import HelloWorld from '@/components/HelloWorld.vue'

export default {
  name: 'Home',
  components: {
    HelloWorld
  }
}
</script>

<style scoped>
.home{
  width: 100%;
  height: 100%;
}
main{
  width: 100%;
  height: calc(100% - 50px);
}
footer{
  width: 100%;
  height: 50px;
}
</style>
